odoo.define('web_optimize.HierarchyRenderer', function (require) {
"use strict";

/**
 * The graph renderer turns the data from the graph model into a nice looking
 * canvas chart.  This code uses the Chart.js library.
 */

var AbstractRenderer = require('web.AbstractRenderer');

var hierarchy_register = require("web_optimize.hierarchy_register");


return AbstractRenderer.extend({
    className: "o_hierarchy_renderer",
    template: 'HierarchyView',
    /**
     * @override
     * @param {Widget} parent
     * @param {Object} state
     * @param {Object} params
     * @param {boolean} [params.isEmbedded]
     * @param {Object} [params.fields]
     * @param {string} [params.title]
     */
    init: function (parent, state, params) {
        this._super.apply(this, arguments);
        this.hierarayWidget = undefined;
        this.$$ = params.$$;
        this.chart = undefined;
        this.hierarayActon = params.action;
        this.ChatWidget = params.hierarayWidget;
        this.def = new $.Deferred();
    },
    start: function () {
        var def = this._super.apply(this, arguments);
        if (!this.hierarayWidget) {
            var widget = hierarchy_register.get(this.ChatWidget);
            this.hierarayWidget = new widget(this, this.hierarayActon, {hierarchy_view: this, $$:this.$$});
        }
        return $.when(def).done(()=>{
            if(!this.chart) {
                this._createDiagram();
                this._createChatNodeTemplate();
            }
            this.def.resolve();
        });
    },
    /**
     * @override
     */
    on_attach_callback: function () {
        this._super.apply(this, arguments);
        var def = this._render();
        $.when(def, this.def).then(()=>{
            this._showChat();
        });
    },
     /**
     * @override
     */
    on_detach_callback: function () {
        this._super.apply(this, arguments);
        if (this.chart) {
           this.chart.div = null;
        }
        this.chart = undefined;
    },
     /**
     * @override
     */
    _render: function () {
         var def = this._super.apply(this, arguments);
         def.then(()=> {
             if (this.chart) {
                this._showChat();
            }
         });
         return def;
    },

    //--------------------------------------------------------------------------
    // Private
    //--------------------------------------------------------------------------

    _createDiagram() {
        this.chart = this.hierarayWidget.initChat(this.$el[0]);
    },

    _createChatNodeTemplate() {
        var nodes = this.hierarayWidget.createNodeCategory();
        for(var nodeType in nodes){
            this.chart.nodeTemplateMap.add(nodeType, nodes[nodeType]);
        }
    },

    _showChat() {
        var covertData = this.hierarayWidget.covertData;
        var data = [];
        if (covertData) {
           data = covertData.apply(this.hierarayWidget, [this.state || []]);
        }else {
            data = this.state || [];
        }
        this.chart.model = go.Model.fromJson({
            "class": "go.TreeModel",
            "nodeDataArray": data
        });
    },

});
});
